<template>
    <basic-container>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-setting"></i> 发货人管理</el-breadcrumb-item>
                <el-breadcrumb-item><i class="el-icon-date"></i>
                    <span v-show="editFlag">修改</span><span v-show="!editFlag">新增</span>发货人
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <avue-form ref="form" v-model="modifyForm" :option="modifyOption">
            <template slot-scope="scope" slot="menuForm">
                <el-button type="primary" @click="handleModify" :loading="btnLoading">提 交</el-button>
                <el-button @click="goBack">返 回</el-button>
            </template>
        </avue-form>
    </basic-container>
</template>

<script>
    import {addObj, getObj, putObj} from '../../api/opc/shipper';
    import {formOption} from '../../const/crud/opc/form_option/shipper';
    import {goBack} from "../../util/util";

    export default {
        data() {
            return {
                modifyForm: {},
                modifyOption: formOption,
                btnLoading: false,
                editFlag: false
            }
        },
        computed: {},
        mounted() {
        },
        created() {
            this.id = this.$route.query.res.id;
            if (this.id) {
                this.editFlag = true;
                this.fetchDetail(this.id);
            } else {
                this.modifyForm.sex = '1';
                this.modifyForm.sort = 100;
            }
        },
        methods: {
            fetchDetail(id) {
                getObj(id).then(response => {
                    this.modifyForm = response.data.data;
                }).catch(() => {
                    this.goBack();
                })
            },
            handleModify() {
                this.btnLoading = true;
                this.$refs.form.validate(res => {
                    if (res) {
                        let done = this.editFlag ? putObj : addObj;
                        done(this.modifyForm).then(res => {
                            this.$message.success(this.editFlag ? '修改' : '新增' + '成功');
                            this.goBack();
                        })
                    }
                    this.btnLoading = false;
                });
            },
            goBack(time = 1000) {
                goBack(this, time);
            }
        }
    }
</script>

<style scoped lang="scss">
    .crumbs {
        margin: 20px 10px;
    }
</style>


